<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head> 
<title>Upload Image</title>

<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript" src="./js/jquery-json.js"></script>
<script type="text/javascript" src="./js/worksubmit.js"></script>

<script src="http://yui.yahooapis.com/3.8.0/build/yui/yui-min.js"></script>
<script type="text/javascript" src="./js/yui-func.js"></script>	
	
</head>
<body class="yui3-skin-sam">
<center><h1>Master Genome Tracking System</h1></center>
<p>
welcome, <s:property value="userName"/> ! [<a href="logout">logout</a>]
</p>
<div id="productsandservices" class="yui3-menu yui3-menu-horizontal yui3-menubuttonnav"><!-- Bounding box -->
    <div class="yui3-menu-content"><!-- Content box -->
        <ul>
            <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="Notebook.action">Notebook</a></li>
            <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="History.action">History</a></li>
            <li><a class="yui3-menu-label" href="Sequence.action"><em>Primer</em></a>
                <div id="submenu-1" class="yui3-menu">
                    <div class="yui3-menu-content">
                        <ul>
                        	<li class="yui3-menuitem"><a class="yui3-menuitem-content" href="Sequence.action">Upload Primer</a></li>
                        	<li class="yui3-menuitem"><a class="yui3-menuitem-content" href="PrimerInsert.action">Add Primer</a></li>
                        	<li class="yui3-menuitem"><a class="yui3-menuitem-content" href="PrimerDelete">Delete Primer</a></li>
                        </ul>
                    </div>
                </div>
             </li>
            <li><a class="yui3-menu-label" href="ImageUpload"><em>Image</em></a>
                <div id="submenu-1" class="yui3-menu">
                    <div class="yui3-menu-content">
                        <ul>
                        	<li class="yui3-menuitem"><a class="yui3-menuitem-content" href="ImageUpload">Upload Image</a></li>
                        	<li class="yui3-menuitem"><a class="yui3-menuitem-content" href="ImageDelete">Delete Image</a></li>
                        </ul>
                    </div>
                </div>
             </li>
            <li class="yui3-menuitem"><a class="yui3-menuitem-content" href="#">Users</a></li>
        </ul>
    </div>
</div>
<p></p>
<center>
<table>
	<tr>
		<td><h3>Image File Upload</h3></td>
	</tr>
</table>
</center>

<center>
<table width="50%" bgcolor="#FFFFFF">
	<s:form action="uploadimg" id="uploadImage" method="post" enctype="multipart/form-data">
	<tr><td><s:select label="Gene name*" name="geneName" headerKey="TK0001" headerValue="TK0001" list="geneList" /></td></tr>
	<tr><td><s:select label="Form name*" name="formName" headerKey="001/002 PCR(A)" headerValue="001/002 PCR(A)" list="formList" /></td></tr>
	<tr><td><s:file name="imageFile" label="Image*" /></td></tr>
	<tr><td><s:submit value="Upload" /></td></tr>
	</s:form>
</table>
<div id=error></div>
<s:if test="%{result == 'success'}">
    <div><font color="green">The file: <s:property value="fileName"/> has been uploaded for <s:property value="geneName"/>'s form <s:property value = "formName"/></font></div>
</s:if>
<s:elseif test="%{result == 'error'}">
    <div><font color="red">Unable to upload file: <s:property value="fileName"/> for <s:property value="geneName"/>'s form <s:property value = "formName"/>, <br>please try renaming the file to upload again</font></div>
</s:elseif>
<s:elseif test="%{result == 'errorInfo'}">
    <div><font color="red">Unable to upload file for <s:property value="geneName"/>'s form <s:property value = "formName"/>, <br>please choose a valid image file (JPG PNG BMP TIF) and the size is less than 5M </font></div>
</s:elseif>
</center>

</body>	
</html>